var showInfoElement;
var intervalId;
var percent = 0;
/**
 * Browse and choose one on native machine.
 * 
 * @return
 */
function browseFile() {
    var fileInputElement = document.getElementById("inputPath");
    fileInputElement.click();
}

/**
 * Show one file's information in the text frame
 * 
 * @return
 */
function showFileInfo() {
    showInfoElement = document.getElementById("InfoText");
    showInfoElement.value = document.getElementById("inputPath").value;
}

/**
 * According to the file type to upload one file.
 * 
 * @param fileType
 * @return
 */
function uploadFile(fileType) {
    
    // send data to backend
    var formData = new FormData();
    formData.append(fileType, document.getElementById("inputPath").files[0]);
    var xhr = new XMLHttpRequest();
    xhr.open("post", "upload");
    xhr.send(formData);
    intervalId = setInterval(function() {
        $.post("getPercent", function(data) {
            percent = Math.round(data.split("%")[0]);
            if(isNaN(percent)){
                percent = 0;
            }
            $("#percent").html(data);
            console.log(percent);
            if (percent >= 100) {
                clearInterval(intervalId);
            }
            showProgress();
        });
    }, 1000);
}

$("#upload").click(function() {
    uploadFile("videofile");
});

function showProgress()
{
    $("#loading_div").css( {
        "width" : percent * 2 + "px",
        "height": "17px"
    });
}
